<template>
	<view>
		<uni-section class="uni-section" title="保密的资料信息" type="line" width="600rpx" padding="0">
			<uni-card padding="10" spacing="0" class="disk-info-card">
				<template v-slot:cover>
					<view class="custom-cover" v-show="false">
						<image class="cover-image" mode="aspectFill" :src="cover">
						</image>
						<view class="cover-content">
							<text class="uni-subtitle uni-white">今日新闻热点</text>
						</view>
					</view>
				</template>
				<uni-list>
					<uni-list-item showArrow :title="diskInfo.url" @click="onClick('url')" clickable></uni-list-item>
					<uni-list-item showArrow :title="diskInfo.key" @click="onClick('key')" clickable></uni-list-item>
					<uni-list-item showArrow :title="diskInfo.type" @click="onClick('type')" clickable></uni-list-item>
				</uni-list>
				<view slot="actions" class="card-actions no-border">
					<view class="card-actions-item" @click="actionsClick('share')">
						<uni-icons type="pyq" :size="extraIcon.shareIcon.size" :color="extraIcon.shareIcon.color">
						</uni-icons>
						<text class="card-actions-item-text">分享</text>
					</view>
					<view class="card-actions-item" @click="actionsClick('heart')">
						<uni-icons type="heart-filled" :size="extraIcon.heartIcon.size"
							:color="extraIcon.heartIcon.color"></uni-icons>
						<text class="card-actions-item-text">点赞</text>
					</view>
					<view class="card-actions-item" @click="actionsClick('star')">
						<uni-icons type="star-filled" :size="extraIcon.starIcon.size" :color="extraIcon.starIcon.color">
						</uni-icons>
						<text class="card-actions-item-text">收藏</text>
					</view>
					<view class="card-actions-item" @click="actionsClick('down')">
						<uni-icons type="cloud-download-filled" :size="extraIcon.downIcon.size"
							:color="extraIcon.downIcon.color"></uni-icons>
						<text class="card-actions-item-text">复制网盘地址</text>
					</view>
				</view>
			</uni-card>
		</uni-section>
	</view>
</template>

<script>
	import simpleCache from '../../utils/Simple-Cache.js'
	export default {
		name: "card-involve-list",
		data() {
			return {
				extraIcon: {
					shareIcon: {
						light: false,
						color: '#999',
						size: 18,
						default: {
							color: '#999',
							size: '18',
							type: 'pyq'
						},
						active: {
							color: '#f40',
							size: '22',
							type: "pyq"
						}
					},
					heartIcon: {
						light: false,
						color: '#999',
						size: 18,
						default: {
							color: '#999',
							size: '18',
							type: 'heart-filled'
						},
						active: {
							color: '#f40',
							size: '22',
							type: "heart-filled"
						}
					},
					starIcon: {
						light: false,
						color: '#999',
						size: 18,
						default: {
							color: '#999',
							size: '18',
							type: 'star-filled'
						},
						active: {
							color: '#f40',
							size: '22',
							type: "star-filled"
						}
					},
					downIcon: {
						light: false,
						color: "#999",
						size: 18,
						default: {
							color: '#999',
							size: '18',
							type: 'cloud-download-filled'
						},
						active: {
							color: '#f40',
							size: '22',
							type: "cloud-download-filled"
						}
					}

				}
			};
		},
		props: ['diskInfo'],
		computed: {},
		methods: {
			onClick(e) {
				console.log(this.diskInfo[e])
			},
			actionsClick(text) {
				this.extraIcon[text + 'Icon'].color = this.extraIcon[text + 'Icon'].active.color
				this.extraIcon[text + 'Icon'].size = this.extraIcon[text + 'Icon'].active.size
				//下载模块逻辑
				if (text == "down") {
					//12小时后可再次获取
					simpleCache.put('downcount', 1, 60 * 60 * 12)
					//通过各种限制后 点击下载将整个对象转字符串新增到剪切板
					// {"url":"https://www.aliyundrive.com/s/SW1Qrv5VUQJ","key":"q44k","type":"阿里云盘"}
					let that = this //回调函数中用得到
					let {
						url,
						key,
						type
					} = this.diskInfo
					uni.setClipboardData({
						data: `网盘地址 ${url} 网盘密码 ${key} 网盘类型 ${type}`,

						success: function() {
							//覆盖操作剪切板默认弹窗
							uni.showToast({
								title: ' '
							})
							uni.hideToast()
							uni.showModal({
								title: '复制成功！',
								content: '已添加到您的剪切板，请查收。',
								showCancel: false,
							})
							//收起diskInfoPanel
							that.$parent.close()
						}
					})
					return
				}
				//四个按钮的提示框
				uni.showToast({
					title: '您已' + text,
					icon: 'none'
				})
			}
		}
	}
</script>

<style lang="less">
	.disk-info-card {
		border-radius: 20rpx;

	}

	.card-actions {
		margin: 30rpx 0;
		display: flex;
		justify-content: space-around;
	}

	.disk-limit-slot {
		position: relative;
		width: 60%;
		display: flex;
		flex-flow: column nowrap;
		justify-content: center;

		text {
			font-size: 30rpx;

		}
	}
</style>
